<template>
    <div class="container post-container">
        <div class="title">“浙里办票”办出便民利企加速度</div>
        <div class="info-attr">
            <div class="info-attr-sub">发布时间：2022-10-21 09:53</div>
            <div class="info-attr-sub">来源：国家税务总局浙江省税务局</div>
            <div class="info-attr-sub">字号：<span class="set-size" @click="setFontsize('20')">[ 大 ]</span><span
                class="set-size" @click="setFontsize('18')">[ 中 ]</span><span class="set-size" @click="setFontsize('16')">[ 小 ]</span>
            </div>
            <div class="info-attr-sub">
                <span class="cp" @click="printPage">打印本页</span>
            </div>
        </div>
        <div class="content" :style="{fontSize}" v-html="content"></div>
    </div>
</template>
<script setup>
import {ref} from "vue";

const content = `<div>
     <!--ZJEG_RSS.content.begin--><meta name="ContentStart"><p style="text-indent: 2em;">税务电子发票的社会化应用一直是民生关注的高频场景。为深化数字化改革，推进全省电子票据一站式服务，省税务局联合多部门，共同打造“浙里办票”应用。</p><p style="text-indent: 2em;">缴款人通过浙江政务服务网、“浙里办”APP、网银、支付宝、银行网点、自助终端等缴款后，可在“浙里办”进入“浙里办票”，查询、查验、下载电子票据，在线发起报销，实现缴款、开票、验票、取票“零跑腿”。范围覆盖考试报名费、交通罚款、医疗费……。</p><p style="text-indent: 2em;">在“浙里办票”应用发布后，纳税服务岗岗员们第一时间上线操作体验，并制作了“掌上办”辅导折页等宣传辅导品，通过线上线下形式广而告知，获得了纳税人缴费人的一致好评。</p><p style="text-align: center;"><a href="/picture/0/77e5c37757e14bc08018de6d397b89b9.png" target="_blank"><img title="" src="https://zhejiang.chinatax.gov.cn/picture/0/s_77e5c37757e14bc08018de6d397b89b9.png" width="341" height="690"></a><a href="/picture/0/358d393736054beea722f24f544b1ff1.png" target="_blank"><img title="" src="https://zhejiang.chinatax.gov.cn/picture/0/s_358d393736054beea722f24f544b1ff1.png" width="401" height="695"></a></p><meta name="ContentEnd"><!--ZJEG_RSS.content.end-->
</div>`
const printPage = () => {
    window.print();
}
const fontSize = ref(16)
const setFontsize = size => {
    fontSize.value = size + 'px'
}
</script>
<style scoped lang="scss">
.post-container {
    padding: 60px 114px 100px;
    background: #ffffff;
    @include respondTo(['phone','pad','notebook']) {
        width: 100%;
        padding: 30px 10px 100px;
    }

    .title {
        width: 100%;
        min-height: 45px;
        line-height: 45px;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        @include respondTo(['phone','pad','notebook']) {
            line-height: 30px;
            font-size: 18px;
            font-weight: bold;
            text-align: center;
            padding: 15px;
        }
    }

    .info-attr {
        width: 100%;
        text-align: center;
        min-height: 46px;
        height: auto;
        line-height: 46px;
        border-bottom: 1px solid #e6e6e6;
        margin-top: 60px;
        display: flex;
        justify-content: space-between;
        font-size: 14px;
        color: #999;

        .set-size {
            cursor: pointer;
            color: #1a56a8;
            user-select: none;
        }

        @include respondTo(['phone','pad','notebook']) {
            margin-top: 0;
            flex-direction: column;
            .info-attr-sub {
                height: 30px;
                line-height: 30px;
                margin-bottom: 10px;
            }
        }
    }

    :deep(.content) {
        width: 100%;
        padding-top: 40px;
        font-size: 16px;
        img {
            max-width: 100%;
            height: auto;
        }

        p {
            line-height: 30px;
            margin-bottom: 10px;
            text-align: justify;
        }
    }
}
</style>
